<template>
    <div class="myOrderLists">
        <van-nav-bar title="我的订单" left-arrow @click-left="onClickLeft" />
        <van-tabs v-model:active="type" @click="onClickTypeTab">
            <van-tab title="商城商品">
                <van-tabs v-model:active="active" @click="onClickTab">
                    <van-tab title="全部">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" @clickOK="childClickOK" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />
                    </van-tab>
                    <van-tab title="待自取">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="待发货">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="待收货">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="已完成">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                </van-tabs>
            </van-tab>
            <van-tab title="消费商品">
                <van-tabs v-model:active="active" @click="onClickTab">
                    <van-tab title="全部">
                        <van-empty description="暂无数据" v-if="listdata.length == 0" />
                        <orderCard class="orderCard" @clickOK="childClickOK" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />
                    </van-tab>
                    <van-tab title="待自取">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="待发货">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="待收货">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                    <van-tab title="已完成">
                        <van-empty v-if="listdata.length == 0" description="暂无数据" />
                        <orderCard class="orderCard" :parentData="item" :key="index"
                            v-for="(item, index) in listdata" />

                    </van-tab>
                </van-tabs>
            </van-tab>
        </van-tabs>
    </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { Toast } from 'vant';
import { useRoute } from 'vue-router';
import { ProductorderLists, confirmOrder } from './../../../api/index';
import orderCard from '../../../components/OrderCard.vue';

const active = ref(0);
const type = ref(0);
const route = useRoute();
const onClickTypeTab = (idx) => {
    fetchData(type.value, active.value - 1)
};
const onClickTab = () => fetchData(type.value, active.value - 1);
const onClickLeft = () => history.back();
let formData = new FormData();
const listdata = ref([])
const childClickOK = (id: any) => {
    console.log(1111111111)
    formData.append("id", id)
    confirmOrder(formData).then(res => {
        if (res.code == 1) {
            Toast(res.msg)
        } else {
            Toast(res.msg)
        }
    })
}
const fetchData = (type: number, status: number) => {
    formData.append("page_size", "15")
    formData.append("type", type == 0 ? "shop" : "bill")
    formData.append("status", status == -1 ? -1 : status == 0 ? 5 : status == 1 ? 6 : status == 2 ? 10 : status == 3 ? 20 : active.value = 0)
    formData.append("page", "1")
    ProductorderLists(formData).then(res => {
        if (res.code == 1) {
            console.log(res.data.list.data)
            listdata.value = res.data.list.data
        } else {
            Toast(res.msg)
        }
    })
    formData = new FormData();
}
onMounted(() => {
    active.value = history.state.active_id;
    console.log(active.value)
    fetchData(type.value, active.value - 1)
})
</script>

<style scoped lang="less">
@import url(../../../style/common.css);
.myOrderLists {
    background: #F6F7F9;
    width: 100%;
    height: 100vh;

    .van-nav-bar {
        height: 52px;
    }

}

:deep(.van-nav-bar__left .van-badge__wrapper) {
    color: #272635;
}
</style>